<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org"
	  xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<meta charset="utf-8">
<head th:include="include :: header"></head>
<body class="gray-bg">

<div class="container-div">
	<div class="row">
		<div class="col-sm-12 search-collapse">
			<form id="role-form">
				<div class="select-list">
					<ul>
						<li>
							告警类型：<select id="warnSpot" name="warnSpot" th:with="type=${@dict.getType('warn_spot')}">
							<option value="">请选择</option>
							<option th:each="dict : ${type}" th:text="${dict.dictLabel}" th:value="${dict.dictValue}"></option>
						</select>
						</li>
						<li>
							是否影响充电：<select id="isEffect" name="isEffect" th:with="type=${@dict.getType('is_effect')}">
							<option value="">请选择</option>
							<option th:each="dict : ${type}" th:text="${dict.dictLabel}" th:value="${dict.dictValue}"></option>
						</select>
						</li>
						<li>
							<input type="hidden" name="beginTime" id="beginTime" th:value="${beginTime}" />
							<input type="hidden" name="endTime" id="endTime" th:value="${endTime}" />
							<input type="hidden" name="stationCode" id="stationCode" th:value="${stationCode}" />
							桩位编号：<input type="text" name="stakeCode" id="stakeCode" placeholder="桩位编号"/>
						</li>
						<li>
							充电枪号：<!--<input type="text" id="gunCode" name="gunCode" placeholder="充电枪编号"/>-->
							<select id="gunCode" name="gunCode" th:with="type=${@dict.getType('gun_code')}">
								<option value="">请选择</option>
								<option th:each="dict : ${type}" th:text="${dict.dictLabel}" th:value="${dict.dictValue}"></option>
							</select>
						</li>


						<li>
							<a class="btn btn-primary btn-rounded btn-sm" onclick="$.table.search()"><i class="fa fa-search"></i>&nbsp;搜索</a>
							<a class="btn btn-warning btn-rounded btn-sm" onclick="$.form.reset()"><i class="fa fa-refresh"></i>&nbsp;重置</a>
						</li>
					</ul>
				</div>
			</form>
		</div>

		<div class="btn-group-sm hidden-xs" id="toolbar" role="group">
			<a class="btn btn-warning" onclick="$.table.exportExcel()" shiro:hasPermission="statistics:warn:exportDetail">
				<i class="fa fa-download"></i> 导出
			</a>
		</div>

		<div class="col-sm-12 select-table table-striped">
			<table id="bootstrap-table" data-mobile-responsive="true"></table>
		</div>
	</div>
</div>
<div th:include="include :: footer"></div>
<script th:inline="javascript">
    var prefix = ctx + "statistics/warn";
    var is_effect = [[${@dict.getType('is_effect')}]];
    var warn_spot = [[${@dict.getType('warn_spot')}]];
    var gun_code = [[${@dict.getType('gun_code')}]];
    var warn_desc = [[${@dict.getType('warn_desc')}]];
    $(function() {
        var options = {
            url: prefix + "/listDetail",
            exportUrl: prefix + "/exportDetail",
            queryParams: queryParams,
            //sortName: "stakeCode",
            modalName: "运营统计报表明细",
            search: false,
            showExport: false,
            columns: [
                {
                    field: 'stakeCode',
                    width: 100,
                    title: '桩号'
                },
                {
                    field: 'gunCode',
                    width: 100,
                    title: '充电枪号',
                    align: 'center',
                    formatter: function(value) {
                        return formatGun(value)
                    }
                },
                {
                    field: 'stationCode',
                    width: 100,
                    title: '站号'
                },
                {
                    field: 'stationName',
                    width: 200,
                    title: '站名'
                },
                {
                    field: 'warnSpot', // 列字段名
                    title: '告警类型',// 列标题
                    width: 100,
                    formatter: function(value) {
                        return $.table.selectDictLabel(warn_spot, value);
                    }
                },
                {
                    field: 'warnDesc',
                    title: '告警描述',
                    width: 100,
                    formatter: function(value) {
                        return $.table.selectDictLabel(warn_desc, value);
                    }
                },
                {
                    field: 'startTime',
                    width: 200,
                    title: '告警开始时间'
                },
                {
                    field: 'endTime',
                    width: 200,
                    title: '告警结束时间'
                },
                {
                    field: 'warnTime',
                    width: 100,
                    title: '告警时长',
                    align: 'right',
                    formatter: function (value, row, index) {
                        return formatSeconds(value)
                    }
                },{
                    field: 'isEffect', // 列字段名
                    title: '是否影响充电', // 列标题
                    width: 100,
                    align: 'center',
                    formatter: function(value) {
                        return $.table.selectDictLabel(is_effect, value);
                    }
                },
            ]
        };
        $.table.init(options);
    });

    function queryParams(params) {
        return {
            stationCode:$("#stationCode").val(),
            warnSpot: $("#warnSpot").val(),
            isEffect:$("#isEffect").val(),
            gunCode:$("#gunCode").val(),
            stakeCode:$("#stakeCode").val(),
            endDate:$("#endTime").val(),
            beginTime:$("#beginTime").val(),
            pageSize:       params.limit,
            pageNum:        params.offset / params.limit + 1,
            searchValue:    params.search,
            orderByColumn:  params.sort,
            isAsc:          params.order
        };
    }

    //判断枪号
    function formatGun(value) {
        if(value==0){
            return '-'
        }else{
            return $.table.selectDictLabel(gun_code, value);
        }
    }
</script>
</body>
</html>